<div class="layui-side layui-bg-black">
	<div class="layui-side-scroll">
		<#include "/apps/business/workorders/include/left.html">
	</div>
</div>
<div class="layui-body">
	<#include "/public/macro.html">
	<div class="row" style="border-bottom: 1px solid #EFEFEF;padding:5px;">
		<div class="col-lg-12" style="padding-left:0px;position: relative;">
			<div class="ukefu-bt"> 
				<div class="layui-icon ukewo-btn ukefu-content-ind" style="width: 40px;height: 40px;">
					<img src="/images/workorders.png"></div>
				<div class="ukefu-bt-text">
					<div class="ukefu-bt-text-title" style="font-weight:400;font-size:20px;">
						<#if workOrders??>${(workOrders.title!'')?no_esc}</#if>
					</div>
					<div class="ukefu-bt-text-content" style="">
						<#if workOrders?? && workOrders.createtime??><span style="font-size:15px;color:#AAAAAA;">工单创建时间：${workOrders.createtime?string('yyyy-MM-dd HH:mm:ss')}</span></#if>
						<#if workOrders?? && workOrders.updatetime??><span style="font-size:15px;color:#AAAAAA;margin-left:30px;">最后更新于：${workOrders.updatetime?string('yyyy-MM-dd HH:mm:ss')}</span></#if>
					</div>
					
				</div>
			</div>
			<div style="position: absolute;right: 0px;"> 
				<a class="layui-btn layui-btn-sm" href="/apps/workorders/edit.html?id=${workOrders.id!''}" title="创建新工单">编辑工单</a>
				<div class="layui-btn-group ukefu-btn-group">
					<a class="layui-btn layui-btn-sm layui-btn-danger" href="/apps/workorders/delete.html?id=${workOrders.id!''}" id="batexp" data-toggle="tip" title="工单删除不可恢复，请确认是否删除工单？">
						<i class="layui-icon">&#x1006;</i>
						删除工单
					</a>
				</div>
			</div>
		</div>
	</div>
	<h1 class="site-h1 ukefu-tab" style="height:26px;">
		<div class="ukefu-tab-title" style="margin-left:0px;">
			<ul class="tab-title" id="workDetailsTab">
				<li class="layui-this"><a href="/apps/workorders/myorders/detail.html?id=${workOrders.id!''}">工单详情</a></li>
				<li><a href="/apps/workorders/detail/dataevent.html?orderid=${workOrders.id!''}" data-toggle="load" data-target="#workOrderContent">变更记录</a></li>
				<li><a href="/apps/workorders/detail/comments.html?orderid=${workOrders.id!''}" data-toggle="load" data-target="#workOrderContent">回复记录</a></li>
				<#if workOrders.cusid??>
				<li><a href="/apps/contacts/detail.html?id=${workOrders.cusid!''}" data-toggle="load" data-target="#workOrderContent">联系人信息</a></li>
				</#if>
				<#if workOrderType?? && workOrderType.bpm && workOrders.bpmid?? && workOrders.memo??>
				<li><a href="/apps/bpm/instance/display.html?processid=${workOrders.bpmid!''}&orderid=${workOrders.memo!''}" data-toggle="load" data-target="#workOrderContent">流程信息</a></li>
				</#if>
			</ul>					
		</div>
	</h1>
	<div id="workOrderContent">
		<div class="row" style="border-bottom: 1px solid #EFEFEF;">
			<div class="col-lg-12" style="padding-left:0px;padding-right:0px;">
				<#include "/apps/business/workorders/include/info.html">
			</div>
		</div>
		<form class="layui-form" id="workOrdersForm" action="/apps/workorders/myorders/save.html" method="post" style="width: 100%;height: 100%;" enctype="multipart/form-data">
			<#if workOrders??><input type="hidden" name="id" value="${workOrders.id!''}"></#if>
			<#if workOrders??><input type="hidden" name="dataid" value="${workOrders.id!''}"></#if>
			<#if workOrders??><input type="hidden" name="status" id="status" value=""></#if>
			<div class="row" style="border-bottom: 1px solid #EFEFEF;">
				<div class="col-lg-12" style="padding-left:0px;padding-right:0px;">
					<h1 class="site-h1">
						工单回复
					</h1>
					<div id="ukefu-comments">
						<div class="ukefu-workorders-comment" id="ukefu-workorders-comment">
							<#if orderCommentList?? && orderCommentList.content?size gt 0>
							<#include "/apps/business/workorders/comments.html">	
							</#if>
						</div>
					</div>
					
					
					<h1 class="site-h1" style="border-top:1px solid #e6e6e6;margin-top:15px;">
						回复
					</h1>
					<div class="row" style="margin-top:5px;">
						<div class="col-lg-12" style="padding-left:0px;line-height:30px;padding-right:0px;">
							<div class="layui-form-item">
							    <div class="layui-input-block" style="margin-left:75px;">
							      	<input type="radio" name="prirep" value="0" title="公开回复" checked>
							      	<input type="radio" name="prirep" value="1" title="私密回复（只有坐席可见）">
							    </div>
							</div>	
						</div>
					</div>
					<div class="row" style="margin-top:5px;">
						<div class="col-lg-12" style="padding-left:0px;line-height:30px;padding-right:0px;padding-left:75px;">
							<textarea name="content" id="content" style="width:100%;height:60px;"></textarea>	
						</div>
					</div>
					<div class="row" style="margin-top:5px;">
						<div class="col-lg-12" style="padding-left:0px;line-height:30px;padding-right:0px;padding-left:75px;">
							<div class="layui-form-item">
								<div class="layui-input-block ukefu-form-block" style="margin-left:0px;">
									<div class="layui-box layui-upload-button">
										<input type="file" name="files"
											accept="*"
											class="layui-upload-file"
											onchange="$(this).closest('.layui-form-item').append($(this).closest('.ukefu-form-block').prop('outerHTML'));$(this).closest('.ukefu-form-block').find('.file_ad').html($(this).val());$(this).closest('.ukefu-form-block').find('.file_del').show();"><span
											class="layui-upload-icon"><i class="layui-icon">&#xe608;</i>上传附件</span>
									</div>
									<span>
										<span class="file_ad"></span>
										<span class="file_del" style="display:none;">
											<a href="javascript:void(0)" style="margin-left:10px;" onclick="$(this).closest('.ukefu-form-block').remove();">
									  			<i class="layui-icon" style="color:red;">&#x1006;</i>
									  			删除
									  		</a>
										</span>
									</span>
								</div>
							</div>	
						</div>
					</div>
					<div class="layui-button-block" style="margin-top:20px;margin-left:75px;text-align:left;">
						<button class="layui-btn" lay-submit="" lay-filter="formDemo">立即提交</button>
						<#list uKeFuDic['com.dic.workorders.status'] as workOrdersStatus>
				    	<#if workOrdersStatus.name=='已处理' && workOrders.status?? && workOrdersStatus.id== workOrders.status>
				    	<button class="layui-btn layui-btn-normal" lay-filter="*" lay-submit ukstatusname="已关闭" ukstatus="uckefu_workorders_closed">确认处理完成</button>
				    	<button class="layui-btn layui-btn-danger" lay-filter="*" lay-submit <#list uKeFuDic['com.dic.workorders.status'] as workOrdersStatus><#if workOrdersStatus.name=='重新打开'>ukstatusname='${workOrdersStatus.name}' ukstatus='${workOrdersStatus.id}'<#break></#if></#list>>重新打开</button>
				    	<#break>
				    	</#if>
				    	</#list>
					</div>
				</div>
			</div>
		</form>
	</div>
	<script>
		$(document).ready(function() {
			layui.use('form', function() {
				var form = layui.form;
				form.render(); //更新全部
				form.on('submit(*)', function(data){
					  console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象
					  $('#status').val($(data.elem).attr("ukstatus"));
				});
			});
			$('#workDetailsTab li a').on("click" , function(){
				$('#workDetailsTab li').removeClass("layui-this");
				$(this).parent().addClass("layui-this");
			});
			
			layui.use(['element', 'flow'], function(){
			  	var element = layui.element ;
			  	var flow = layui.flow;
				flow.load({
				    elem: '#ukefu-comments' //指定列表容器
				   	,scrollElem:".ukefu-col-right"
				    ,done: function(page, next){ //到达临界点（默认滚动触发），触发下一页
				      $.get('/apps/workorders/comments.html?orderid=${workOrders.id!''}&p='+page, function(res){
				        //假设你的列表返回在data集合中
				        
				        //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
				        //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
				        next($('#ukefu-workorders-comment').append(res) , $(res).length > 0);    
				      });
				    }
				});
			});
			KindEditor.ready(function(K) {
				K.create('#content', {
					themeType : 'simple',
					width:"100%",
					resizeType:0,
					uploadJson : "/res/image/upload.html",
					items : ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
							 'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
							 'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
		            allowFileManager : false,
					fontsize:16
				});
			});
			KindEditor.options.cssData = "body { font-size: 15px; font-family:'Microsoft Yahei', 'Helvetica', 'Simsun', 'Arial';}";
		});
	</script>
</div>
